<!DOCTYPE html>
<html lang="en">
<head>
  <title>Test::labelled inputs</title>
  <meta charset="UTF-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body>
<h1>Payment</h1>

<div style="width: 400px">
  <form>
    <fieldset title="Payment form">
      <div>
        <label>Recipient name
          <input id="beneficiaryName" name="beneficiaryName" placeholder="Beneficiary name, e.g. John Smith" value="Dear grandma"/>
        </label>
      </div>
      <div>
        <label for="toAccount">To account</label>
        <input id="toAccount" name="beneficiaryAccount"
               data-test-id="beneficiary-account"
               placeholder="To account, e.g. EE111222333444" value="9999-888-77-6"/>
      </div>
      <div>
        <label for="fromAccount">From account</label>
        <select id="fromAccount" name="remitterAccount" data-test-id="remitter-account">
          <option value="1111-222-3-4444">1111-222-3-4444</option>
          <option value="1111-222-3-5555">1111-222-3-5555</option>
          <option value="1111-222-3-6666" selected>1111-222-3-6666</option>
          <option value="1111-222-3-7777">1111-222-3-7777</option>
          <option value="1111-222-3-8888">1111-222-3-8888</option>
          <option value="1111-222-3-9999">1111-222-3-9999</option>
        </select>
      </div>
      <hr/>
      <div>
        <input type="button" id="submit" value="Pay!"/>
      </div>
    </fieldset>
  </form>

  <div>
    <label>Payment Date<input name="day" value="01.12.2024"/></label>
  </div>
  <div>
    <label>Payment date<input name="day" value="02.12.2024"/></label>
  </div>
  <div>
    <label id="xxx">payment Date<input name="day" value="03.12.2024"/></label>
  </div>
  <div>
    <label>payment date<input name="day" value="04.12.2024"/></label>
  </div>
  <div>
    <label>Payment   Date<input name="day" value="05.12.2024"/></label>
  </div>

</div>

<span id="toAccount" style="visibility: hidden">Some random element with the same ID</span>

<style>
  input, select {
    min-width: 300px;
  }
</style>
</body>
</html>
